<template>
    <el-dialog title="导出选点" :model-value="modelValue" width="320px" @closed="handleClose">
        <section class="btn-group">
            <el-button type="primary" plain @click="handleExportSelected">导出已选点位表</el-button>
            <el-button type="primary" style="margin-bottom: 10px" plain @click="handleExportSelectedMap"
            >导出已选点位地图</el-button
            >
            <!-- <el-button @click="handlExportKickedList">导出实际上刊点位表</el-button> -->
        </section>
    </el-dialog>
</template>

<script setup lang="ts">
import { ref, defineProps, defineEmits, computed, reactive } from 'vue';
import { exportSelectedMap, exportKickedList, exportSelected } from '@/api/plan.ts';
import { useStore } from 'vuex';
import { downLoadCommon, exportFormBlob } from '@/utils/common';

const store = useStore();
const emits = defineEmits<{(e: 'update:modelValue', visible: boolean): void; (e: 'success'): void }>();
const type = ref(null);
const textarea = ref<object | null>(null);
const props = defineProps({
    modelValue: {
        type: Boolean,
        default: false,
    },
    planDetail: {
        type: Object,
        default: () => null,
    },
});
const handleClose = () => {
    emits('update:modelValue', false);
};

const handleExportSelected = async () => {
    const data = await exportSelected({ planId: props.planDetail.planId });
    console.log('data: ', data);
    downLoadCommon(data);
};

const handleExportSelectedMap = async () => {
    const { file, fileName } = await exportSelectedMap({ planId: props.planDetail.planId });
    exportFormBlob(file, fileName);
};

// const handlExportKickedList = async () => {
//     const { data } = await exportKickedList({ planId: props.planDetail.planId });
//     downLoadCommon(data);
// };

const submit = async () => {
    const params = {
        planId: props.planDetail.planId,
        pointCodeList: textarea.value.split(/[(\r\n)\r\n]+/).filter((code) => code),
    };
    if (type.value === 'kickOutPoint') {
        await kickOutPoint(params);
    } else {
        await addPoint(params);
    }
    // await preorder(params);
    handleClose();
    emits('success');
};
</script>

<style lang="scss" scoped>
.btn-group {
    text-align: center;
    .el-button {
        display: inline-block;
        width: 270px;
        height: 55px;

        & + .el-button {
            margin: 15px 0 0;
        }
    }
}
.el-button--primary.is-plain {
    background: #f7f7f7;
    border-color: #f7f7f7;
    color: #333;
    &:hover {
        border-color: var(--el-button-text-color);
        background: var(--el-button-bg-color);
    }
}
</style>
